import { Button } from "@vercel/geistdocs/components/button";
import DynamicLink from "fumadocs-core/dynamic-link";

interface CTAProps {
  cta: string;
  href: string;
  title: string;
}

export const CTA = ({ title, href, cta }: CTAProps) => (
  <section className="flex @min-[768px]:flex-row flex-col items-center @min-[768px]:justify-between gap-4 py-10">
    <h2 className="@min-[768px]:text-left text-center font-[450]! @min-[640px]:text-heading-40 text-gray-1000 text-heading-32 tracking-tighter">
      {title}
    </h2>
    <Button
      Component={DynamicLink}
      className="w-fit rounded-full"
      href={`/[lang]${href}`}
      size="large"
    >
      {cta}
    </Button>
  </section>
);